Skip to content

Lazy load for components, filters and directives (fix #8106) #8807

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from

Conversation

rhengles
Copy link

What kind of change does this PR introduce? (check at least one)

  • Bugfix
  • Feature
  • Code style update
  • Refactor
  • Build-related changes
  • Other, please describe:

Does this PR introduce a breaking change? (check one)

  • Yes
  • No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

If adding a new feature, the PR's description includes:

  • A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it)

Other information:

The convincing reason was explained at length over at #8106. I know this will not be merged, in fact I'm gonna close it myself. But I'm publishing this PR for reference for anyone else interested.

The initial need was for components, but when reviewing the code I thought the most elegant way to do this was by changing the resolveAsset() function to call a user function defined on the $options object:

getComponent(id: string, identifierSpellings: Object): void | Component | AsyncComponent
getDirective(id: string, identifierSpellings: Object): void | Directive
getFilter(id: string, identifiesSpellings: Object): void | Filter

The identifierSpellings object has normalized spellings in case the user needs it:

  • raw: the way it was called
  • hyphenated
  • camelized
  • PascalCase
  • and a toString() method, which returns the raw version

The nice thing about this is that it gives all the power to the user, and enables him to do many things which aren't possible with the current api, and the biggest use case is to lazily load async components only when they are needed.

I know that to submit a decent PR, I'd still need to write tests and documentation... that is the next step.

A running example can be seen here:

https://unpkg.com/@arijs/vue-generator@0.1.4/outra/pagina/

My version is released at:
https://unpkg.com/@arijs/vue@2.5.17-beta1.0/
https://www.npmjs.com/package/@arijs/vue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant